'use strict'
import { App, ListView, Button } from '../../component'
import style from './css.css'
import Item from './item'
import Header from './header'
import GiftAlert from './newGift'
import UserBtn from './user'
import SigBox from './sig'
import setTitle from '../../config/setTitle'
import { observer, inject } from 'mobx-react'
@inject('list', 'user') @observer class List extends React.Component {
  static propTypes = {
    list: PropTypes.object,
    user: PropTypes.object,
    history: PropTypes.object
  }
  constructor (props) {
    super(props)
    this.state = {
      gift: 0,
      sigState: 0
    }
  }
  componentWillMount () {
    setTitle('芒果抓娃娃')
    this.props.user.getUserInfo()
  }
  componentDidMount () { this.props.list.getList() }
  // 渲染签到按钮
  _renderSigBtn () {
    const { userInfo, changeSigDisPlay, signToday } = this.props.user
    const { sig } = userInfo
    if (sig) {
      return (
        <Button
          tapClassName={style.sigBtnPress}
          className={ style.sigBtn }
          tap={() => {
            signToday()
            changeSigDisPlay()
          }}
        >
        </Button>
      )
    }
  }
  // 渲染签到弹窗
  _renderSigBox () {
    const { userInfo, sigShow, changeSigDisPlay } = this.props.user
    const { sig } = userInfo
    if (sig) { return (<SigBox state={sigShow} changeSigDisPlay={changeSigDisPlay} />) }
  }
  // 渲染新手奖励弹窗
  _renderNewGift () {
    const { userInfo, newGiftShow, changeNewGiftState } = this.props.user
    const { newGiftNumber } = userInfo
    return (<GiftAlert changeNewGiftState={changeNewGiftState} state={newGiftShow} number={newGiftNumber} />)
  }
  render () {
    return (
      <App noSysScroll={true}>
        <ListView
          className={style.listView}
          layoutClassName={style.layoutClassName}
          dataSource={this.props.list.list}
          Item={Item}
          itemProp = {{ history: this.props.history }}
          headerProp = {{ banners: this.props.list.banners.slice(), history: this.props.history }}
          ItemKey={'room_id'}
          Header={Header}
          topRefresh={(cb) => { this.props.list.getList(cb) }}
        >
        </ListView>
        <UserBtn history={this.props.history} />
        {this._renderSigBtn()}
        {this._renderSigBox()}
        {this._renderNewGift()}
      </App>
    )
  }
}

export default List
